<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="Docutils: https://docutils.sourceforge.io/" />
<title>Web Widget One2Many Product Picker</title>
<style type="text/css">

/*
:Author: David Goodger (goodger@python.org)
:Id: $Id: html4css1.css 8954 2022-01-20 10:10:25Z milde $
:Copyright: This stylesheet has been placed in the public domain.

Default cascading style sheet for the HTML output of Docutils.

See https://docutils.sourceforge.io/docs/howto/html-stylesheets.html for how to
customize this style sheet.
*/

/* used to remove borders from tables and images */
.borderless, table.borderless td, table.borderless th {
  border: 0 }

table.borderless td, table.borderless th {
  /* Override padding for "table.docutils td" with "! important".
     The right padding separates the table cells. */
  padding: 0 0.5em 0 0 ! important }

.first {
  /* Override more specific margin styles with "! important". */
  margin-top: 0 ! important }

.last, .with-subtitle {
  margin-bottom: 0 ! important }

.hidden {
  display: none }

.subscript {
  vertical-align: sub;
  font-size: smaller }

.superscript {
  vertical-align: super;
  font-size: smaller }

a.toc-backref {
  text-decoration: none ;
  color: black }

blockquote.epigraph {
  margin: 2em 5em ; }

dl.docutils dd {
  margin-bottom: 0.5em }

object[type="image/svg+xml"], object[type="application/x-shockwave-flash"] {
  overflow: hidden;
}

/* Uncomment (and remove this text!) to get bold-faced definition list terms
dl.docutils dt {
  font-weight: bold }
*/

div.abstract {
  margin: 2em 5em }

div.abstract p.topic-title {
  font-weight: bold ;
  text-align: center }

div.admonition, div.attention, div.caution, div.danger, div.error,
div.hint, div.important, div.note, div.tip, div.warning {
  margin: 2em ;
  border: medium outset ;
  padding: 1em }

div.admonition p.admonition-title, div.hint p.admonition-title,
div.important p.admonition-title, div.note p.admonition-title,
div.tip p.admonition-title {
  font-weight: bold ;
  font-family: sans-serif }

div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title, .code .error {
  color: red ;
  font-weight: bold ;
  font-family: sans-serif }

/* Uncomment (and remove this text!) to get reduced vertical space in
   compound paragraphs.
div.compound .compound-first, div.compound .compound-middle {
  margin-bottom: 0.5em }

div.compound .compound-last, div.compound .compound-middle {
  margin-top: 0.5em }
*/

div.dedication {
  margin: 2em 5em ;
  text-align: center ;
  font-style: italic }

div.dedication p.topic-title {
  font-weight: bold ;
  font-style: normal }

div.figure {
  margin-left: 2em ;
  margin-right: 2em }

div.footer, div.header {
  clear: both;
  font-size: smaller }

div.line-block {
  display: block ;
  margin-top: 1em ;
  margin-bottom: 1em }

div.line-block div.line-block {
  margin-top: 0 ;
  margin-bottom: 0 ;
  margin-left: 1.5em }

div.sidebar {
  margin: 0 0 0.5em 1em ;
  border: medium outset ;
  padding: 1em ;
  background-color: #ffffee ;
  width: 40% ;
  float: right ;
  clear: right }

div.sidebar p.rubric {
  font-family: sans-serif ;
  font-size: medium }

div.system-messages {
  margin: 5em }

div.system-messages h1 {
  color: red }

div.system-message {
  border: medium outset ;
  padding: 1em }

div.system-message p.system-message-title {
  color: red ;
  font-weight: bold }

div.topic {
  margin: 2em }

h1.section-subtitle, h2.section-subtitle, h3.section-subtitle,
h4.section-subtitle, h5.section-subtitle, h6.section-subtitle {
  margin-top: 0.4em }

h1.title {
  text-align: center }

h2.subtitle {
  text-align: center }

hr.docutils {
  width: 75% }

img.align-left, .figure.align-left, object.align-left, table.align-left {
  clear: left ;
  float: left ;
  margin-right: 1em }

img.align-right, .figure.align-right, object.align-right, table.align-right {
  clear: right ;
  float: right ;
  margin-left: 1em }

img.align-center, .figure.align-center, object.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

table.align-center {
  margin-left: auto;
  margin-right: auto;
}

.align-left {
  text-align: left }

.align-center {
  clear: both ;
  text-align: center }

.align-right {
  text-align: right }

/* reset inner alignment in figures */
div.align-right {
  text-align: inherit }

/* div.align-center * { */
/*   text-align: left } */

.align-top    {
  vertical-align: top }

.align-middle {
  vertical-align: middle }

.align-bottom {
  vertical-align: bottom }

ol.simple, ul.simple {
  margin-bottom: 1em }

ol.arabic {
  list-style: decimal }

ol.loweralpha {
  list-style: lower-alpha }

ol.upperalpha {
  list-style: upper-alpha }

ol.lowerroman {
  list-style: lower-roman }

ol.upperroman {
  list-style: upper-roman }

p.attribution {
  text-align: right ;
  margin-left: 50% }

p.caption {
  font-style: italic }

p.credits {
  font-style: italic ;
  font-size: smaller }

p.label {
  white-space: nowrap }

p.rubric {
  font-weight: bold ;
  font-size: larger ;
  color: maroon ;
  text-align: center }

p.sidebar-title {
  font-family: sans-serif ;
  font-weight: bold ;
  font-size: larger }

p.sidebar-subtitle {
  font-family: sans-serif ;
  font-weight: bold }

p.topic-title {
  font-weight: bold }

pre.address {
  margin-bottom: 0 ;
  margin-top: 0 ;
  font: inherit }

pre.literal-block, pre.doctest-block, pre.math, pre.code {
  margin-left: 2em ;
  margin-right: 2em }

pre.code .ln { color: grey; } /* line numbers */
pre.code, code { background-color: #eeeeee }
pre.code .comment, code .comment { color: #5C6576 }
pre.code .keyword, code .keyword { color: #3B0D06; font-weight: bold }
pre.code .literal.string, code .literal.string { color: #0C5404 }
pre.code .name.builtin, code .name.builtin { color: #352B84 }
pre.code .deleted, code .deleted { background-color: #DEB0A1}
pre.code .inserted, code .inserted { background-color: #A3D289}

span.classifier {
  font-family: sans-serif ;
  font-style: oblique }

span.classifier-delimiter {
  font-family: sans-serif ;
  font-weight: bold }

span.interpreted {
  font-family: sans-serif }

span.option {
  white-space: nowrap }

span.pre {
  white-space: pre }

span.problematic {
  color: red }

span.section-subtitle {
  /* font-size relative to parent (h1..h6 element) */
  font-size: 80% }

table.citation {
  border-left: solid 1px gray;
  margin-left: 1px }

table.docinfo {
  margin: 2em 4em }

table.docutils {
  margin-top: 0.5em ;
  margin-bottom: 0.5em }

table.footnote {
  border-left: solid 1px black;
  margin-left: 1px }

table.docutils td, table.docutils th,
table.docinfo td, table.docinfo th {
  padding-left: 0.5em ;
  padding-right: 0.5em ;
  vertical-align: top }

table.docutils th.field-name, table.docinfo th.docinfo-name {
  font-weight: bold ;
  text-align: left ;
  white-space: nowrap ;
  padding-left: 0 }

/* "booktabs" style (no vertical lines) */
table.docutils.booktabs {
  border: 0px;
  border-top: 2px solid;
  border-bottom: 2px solid;
  border-collapse: collapse;
}
table.docutils.booktabs * {
  border: 0px;
}
table.docutils.booktabs th {
  border-bottom: thin solid;
  text-align: left;
}

h1 tt.docutils, h2 tt.docutils, h3 tt.docutils,
h4 tt.docutils, h5 tt.docutils, h6 tt.docutils {
  font-size: 100% }

ul.auto-toc {
  list-style-type: none }

</style>
</head>
<body>
<div class="document" id="web-widget-one2many-product-picker">
<h1 class="title">Web Widget One2Many Product Picker</h1>

<!-- !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten.                   !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:47b0bfe96ef813df98555eca4fda7caae28c6f4899c67b2faad2a995496814cd
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/13.0/web_widget_one2many_product_picker"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-13-0/web-13-0-web_widget_one2many_product_picker"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=13.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
<p>Adds the ‘one2many_product_picker’ friendly mobile widget to create one2many lines linked with product.product records.</p>
<p><strong>Table of contents</strong></p>
<div class="contents local topic" id="contents">
<ul class="simple">
<li><a class="reference internal" href="#installation" id="toc-entry-1">Installation</a></li>
<li><a class="reference internal" href="#configuration" id="toc-entry-2">Configuration</a><ul>
<li><a class="reference internal" href="#widget-options" id="toc-entry-3">Widget options:</a></li>
<li><a class="reference internal" href="#default-context" id="toc-entry-4">Default context:</a></li>
<li><a class="reference internal" href="#examples" id="toc-entry-5">Examples:</a></li>
<li><a class="reference internal" href="#boostrap-modifications" id="toc-entry-6">Boostrap Modifications:</a></li>
</ul>
</li>
<li><a class="reference internal" href="#usage" id="toc-entry-7">Usage</a><ul>
<li><a class="reference internal" href="#parts-of-the-widget" id="toc-entry-8">Parts of the widget:</a></li>
<li><a class="reference internal" href="#preview" id="toc-entry-9">Preview:</a></li>
</ul>
</li>
<li><a class="reference internal" href="#known-issues-roadmap" id="toc-entry-10">Known issues / Roadmap</a></li>
<li><a class="reference internal" href="#bug-tracker" id="toc-entry-11">Bug Tracker</a></li>
<li><a class="reference internal" href="#credits" id="toc-entry-12">Credits</a><ul>
<li><a class="reference internal" href="#authors" id="toc-entry-13">Authors</a></li>
<li><a class="reference internal" href="#contributors" id="toc-entry-14">Contributors</a></li>
<li><a class="reference internal" href="#maintainers" id="toc-entry-15">Maintainers</a></li>
</ul>
</li>
</ul>
</div>
<div class="section" id="installation">
<h1><a class="toc-backref" href="#toc-entry-1">Installation</a></h1>
<p>It’s advisable to install ‘web_widget_numeric_step’ to have a better usability on touch screens.</p>
</div>
<div class="section" id="configuration">
<h1><a class="toc-backref" href="#toc-entry-2">Configuration</a></h1>
<p>Create or edit a new view and use the new widget called ‘one2many_product_picker’.
You need to define the view fields. The view must be of <tt class="docutils literal">form</tt> type.</p>
<div class="section" id="widget-options">
<h2><a class="toc-backref" href="#toc-entry-3">Widget options:</a></h2>
<ul>
<li><p class="first">groups &gt; Array of dictionaries -&gt; Declare the groups</p>
<blockquote>
<ul>
<li><p class="first">name -&gt; The group name</p>
</li>
<li><p class="first">string -&gt; The text displayed</p>
</li>
<li><p class="first">domain -&gt; Forced domain to use</p>
</li>
<li><p class="first">order -&gt; The order</p>
<blockquote>
<ul class="simple">
<li>name -&gt; The field name to order</li>
<li>asc -&gt; Flag to use ‘asc’ order</li>
</ul>
</blockquote>
</li>
<li><p class="first">records_per_page &gt; Integer -&gt; Used to control the load more behaviour (16 by default)</p>
</li>
<li><p class="first">active -&gt; Boolean -&gt; Select the default group to use (‘false’ by default = ‘All’ group)</p>
</li>
</ul>
</blockquote>
</li>
<li><p class="first">currency_field &gt; Model field used to format monetary values (‘currency_id’ by default)</p>
</li>
<li><p class="first">field_map &gt; Dictionary:</p>
<blockquote>
<ul class="simple">
<li>product -&gt; The field that represent the product (<cite>product_id</cite> by default)</li>
<li>name -&gt; The field that represent a name (‘name’ by default)</li>
<li>product_uom -&gt; The field that represent a product_uom (‘product_uom’ by default)</li>
<li>product_uom_qty -&gt; The field that represent a product_uom_qty (‘product_uom_qty’ by default)</li>
<li>price_unit -&gt; The field that represent a price_unit (‘price_unit’ by default)</li>
<li>discount -&gt; The field that represent a discount (‘discount’ by default)</li>
</ul>
</blockquote>
</li>
<li><p class="first">search &gt; Array of dictionaries (defines to use name_search by default)</p>
<blockquote>
<ul>
<li><p class="first">name -&gt; The name to display</p>
</li>
<li><p class="first">domain -&gt; The domain to use</p>
<blockquote>
<ul class="simple">
<li>$search -&gt; Replaces it with the current value of the searchbox</li>
<li>$number_search -&gt; Replaces all the leaf with the current value of the searchbox as a number</li>
</ul>
</blockquote>
</li>
<li><p class="first">name_search_value -&gt; Enables the use of ‘name_search’ instead of ‘search_read’ and defines the value to search (‘$search’ by default)</p>
</li>
<li><p class="first">operator -&gt; Operator used in ‘name_search’ (‘ilike’ by default)</p>
</li>
</ul>
</blockquote>
</li>
<li><p class="first">edit_discount &gt; Enable/Disable discount edits (False by default)</p>
</li>
<li><p class="first">edit_price &gt; Enable/Disable price edits (True by default)</p>
</li>
<li><p class="first">show_discount &gt; Enable/Disable display discount (False by default)</p>
</li>
<li><p class="first">show_subtotal &gt; Enable/Disable show subtotal (True by default)</p>
</li>
<li><p class="first">auto_save &gt; Enable/Disable auto save (False by default)</p>
</li>
<li><p class="first">auto_save_delay &gt; The time (in milliseconds) to wait after the last interaction before launching the autosave (1500 by default)</p>
</li>
<li><p class="first">all_domain &gt; The domain used in ‘All’ section ([] by default)</p>
<p>If using auto save feature, you should keep in mind that the “Save” and “Discard” buttons
will lose part of its functionality as the document will be saved every time you
modify/create a record with the widget.</p>
</li>
<li><p class="first">ignore_warning &gt; Enable/Disable display onchange warnings (False by default)</p>
</li>
<li><p class="first">instant_search &gt; Enable/Disable instant search mode (False by default)</p>
</li>
<li><p class="first">trigger_refresh_fields &gt; Fields in the main record that dispatch a widget refresh ([“partner_id”, “currency_id”] by default)</p>
</li>
<li><p class="first">auto_focus &gt; Keep the focus on the search box after performing a search (True by default)</p>
</li>
</ul>
<p>All widget options are optional.
Notice that you can call ‘_’ method to use translations. This only can be used with this widget.</p>
<p>Example:</p>
<pre class="code literal-block">
options=&quot;{'search': [{'name': _('Starts With'), 'domain': [('name', '=like', '$search%')]}], 'groups': [{'name': 'cheap', 'string': _('Cheap'), 'domain': [('list_price', '&lt;', 10.0)], 'field_map': { 'product': 'my_product_id' }}]}&quot;
</pre>
</div>
<div class="section" id="default-context">
<h2><a class="toc-backref" href="#toc-entry-4">Default context:</a></h2>
<p>The widget sends a defaults context with the ‘search_read’ request:</p>
<blockquote>
<ul>
<li><p class="first">active_search_group_name &gt; Contains the name of the active search group</p>
<blockquote>
<ul class="simple">
<li>‘all’ &gt; Is the hard-coded name for the ‘All’ group</li>
<li>‘main_lines’ &gt; Is the hard-coded name for the ‘Lines’ group</li>
</ul>
</blockquote>
</li>
<li><p class="first">active_search_involved_fields &gt; Contains an array of dictionaries with the fields used with the searchbox content</p>
<blockquote>
<ul class="simple">
<li>‘type’ &gt; Can be ‘text’ or ‘number’</li>
<li>‘field’ &gt; The field name</li>
<li>‘oper’ &gt; The operator used</li>
</ul>
</blockquote>
</li>
</ul>
</blockquote>
</div>
<div class="section" id="examples">
<h2><a class="toc-backref" href="#toc-entry-5">Examples:</a></h2>
<p>This is an example that uses the ‘sale.order.line’ fields:</p>
<pre class="code xml literal-block">
<span class="nt">&lt;field</span><span class="w">
    </span><span class="na">name=</span><span class="s">&quot;order_line&quot;</span><span class="w">
    </span><span class="na">attrs=</span><span class="s">&quot;{'readonly': [('state', 'in', ('done','cancel'))]}&quot;</span><span class="w">
    </span><span class="na">nolabel=</span><span class="s">&quot;1&quot;</span><span class="w">
    </span><span class="na">mode=</span><span class="s">&quot;form&quot;</span><span class="w">
    </span><span class="na">widget=</span><span class="s">&quot;one2many_product_picker&quot;</span><span class="w">
    </span><span class="na">options=</span><span class="s">&quot;{'search': [{'name': 'Test', 'domain': [['name', 'ilike', '$search']]}] ,'edit_discount': True, 'show_discount': True, 'groups': [{'name': 'desk', 'string': _('Desks'), 'domain': [('name', 'ilike', '%desk%')], 'order': [{'name': 'id', 'asc': true}]}, {'name': 'chair', 'string': _('Chairs'), 'domain': [('name', 'ilike', '%chair%')]}]}&quot;</span><span class="w">
</span><span class="nt">&gt;</span><span class="w">
    </span><span class="nt">&lt;form&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;state&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;display_type&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;currency_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;discount&quot;</span><span class="w"> </span><span class="na">widget=</span><span class="s">&quot;numeric_step&quot;</span><span class="w"> </span><span class="na">options=</span><span class="s">&quot;{'max': 100}&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;price_unit&quot;</span><span class="w"> </span><span class="na">widget=</span><span class="s">&quot;numeric_step&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;name&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;order_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_uom_qty&quot;</span><span class="w"> </span><span class="na">class=</span><span class="s">&quot;mb-1&quot;</span><span class="w"> </span><span class="na">widget=</span><span class="s">&quot;numeric_step&quot;</span><span class="w"> </span><span class="na">context=</span><span class="s">&quot;{
            'partner_id': parent.partner_id,
            'quantity': product_uom_qty,
            'pricelist': parent.pricelist_id,
            'uom': product_uom,
            'company_id': parent.company_id
        }&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_uom&quot;</span><span class="w"> </span><span class="na">force_save=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="na">attrs=</span><span class="s">&quot;{
            'readonly': [('state', 'in', ('sale','done', 'cancel'))],
            'required': [('display_type', '=', False)],
        }&quot;</span><span class="w"> </span><span class="na">context=</span><span class="s">&quot;{'company_id': parent.company_id}&quot;</span><span class="w"> </span><span class="na">class=</span><span class="s">&quot;mb-2&quot;</span><span class="w"> </span><span class="na">options=</span><span class="s">&quot;{'no_open': True, 'no_create': True, 'no_edit': True}&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
    </span><span class="nt">&lt;/form&gt;</span><span class="w">
</span><span class="nt">&lt;/field&gt;</span>
</pre>
<p>** In this example we don’t use ‘field_map’ option because the default match with the sale.order.line field names.</p>
<p>Other example for ‘purchase.order.line’ fields:</p>
<pre class="code xml literal-block">
<span class="nt">&lt;field</span><span class="w">
    </span><span class="na">name=</span><span class="s">&quot;order_line&quot;</span><span class="w">
    </span><span class="na">attrs=</span><span class="s">&quot;{'readonly': [('state', 'in', ('done','cancel'))]}&quot;</span><span class="w">
    </span><span class="na">nolabel=</span><span class="s">&quot;1&quot;</span><span class="w">
    </span><span class="na">widget=</span><span class="s">&quot;one2many_product_picker&quot;</span><span class="w">
    </span><span class="na">mode=</span><span class="s">&quot;form&quot;</span><span class="w">
    </span><span class="na">options=</span><span class="s">&quot;{'search': [{'name': _('Name'), 'domain': [['name', 'ilike', '$search']]}, {'name': _('Price'), 'domain': [['list_price', '=', $number_search]]}], 'field_map': {'product_uom_qty': 'product_qty'}, 'groups': [{'name': _('Desk'), 'domain': [['name', 'ilike', 'desk']], 'order': {'name': 'id', 'asc': true}}, {'name': _('Chairs'), 'domain': [['name', 'ilike', 'chair']]}]}&quot;</span><span class="w">
</span><span class="nt">&gt;</span><span class="w">
    </span><span class="nt">&lt;form&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;name&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;price_unit&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w">  </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;currency_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;order_id&quot;</span><span class="w"> </span><span class="na">invisible=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;date_planned&quot;</span><span class="w"> </span><span class="na">class=</span><span class="s">&quot;mb-1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_qty&quot;</span><span class="w"> </span><span class="na">class=</span><span class="s">&quot;mb-1&quot;</span><span class="w"> </span><span class="na">widget=</span><span class="s">&quot;numeric_step&quot;</span><span class="w"> </span><span class="na">required=</span><span class="s">&quot;1&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
        </span><span class="nt">&lt;field</span><span class="w"> </span><span class="na">name=</span><span class="s">&quot;product_uom&quot;</span><span class="w"> </span><span class="na">class=</span><span class="s">&quot;mb-2&quot;</span><span class="w"> </span><span class="na">options=</span><span class="s">&quot;{'no_open': True, 'no_create': True, 'no_edit': True}&quot;</span><span class="w"> </span><span class="nt">/&gt;</span><span class="w">
    </span><span class="nt">&lt;/form&gt;</span><span class="w">
</span><span class="nt">&lt;/field&gt;</span>
</pre>
</div>
<div class="section" id="boostrap-modifications">
<h2><a class="toc-backref" href="#toc-entry-6">Boostrap Modifications:</a></h2>
<p>The product picker view container have a custom media queries space adding a new screen size called ‘xxl’ (&gt;= 1440px) and modifies the columns to have 24 instead of 12.
This means that you can use “col-xxl-” inside the product picker view container.</p>
</div>
</div>
<div class="section" id="usage">
<h1><a class="toc-backref" href="#toc-entry-7">Usage</a></h1>
<p>When you change the value of a field and switch to edit another record, the
changes will be applied to the previous record without having to click on
accept changes.</p>
<div class="section" id="parts-of-the-widget">
<h2><a class="toc-backref" href="#toc-entry-8">Parts of the widget:</a></h2>
<blockquote>
<img alt="https://raw.githubusercontent.com/OCA/web/13.0/web_widget_one2many_product_picker/static/img/product_picker_anat.png" src="https://raw.githubusercontent.com/OCA/web/13.0/web_widget_one2many_product_picker/static/img/product_picker_anat.png" />
</blockquote>
</div>
<div class="section" id="preview">
<h2><a class="toc-backref" href="#toc-entry-9">Preview:</a></h2>
<blockquote>
<img alt="https://raw.githubusercontent.com/OCA/web/13.0/web_widget_one2many_product_picker/static/img/product_picker.gif" src="https://raw.githubusercontent.com/OCA/web/13.0/web_widget_one2many_product_picker/static/img/product_picker.gif" />
</blockquote>
</div>
</div>
<div class="section" id="known-issues-roadmap">
<h1><a class="toc-backref" href="#toc-entry-10">Known issues / Roadmap</a></h1>
<ul class="simple">
<li>Translations in the xml ‘options’ attribute of the field that use the widget can’t be exported automatically to be translated</li>
<li>The product card animations can be improved. Currently the card is recreated, so we lost some elements to apply correct effects</li>
<li>sale.order onchanges that affects to “order_line” subfields will be ommitted to increase the performance</li>
</ul>
</div>
<div class="section" id="bug-tracker">
<h1><a class="toc-backref" href="#toc-entry-11">Bug Tracker</a></h1>
<p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/web/issues">GitHub Issues</a>.
In case of trouble, please check there if your issue has already been reported.
If you spotted it first, help us to smash it by providing a detailed and welcomed
<a class="reference external" href="https://github.com/OCA/web/issues/new?body=module:%20web_widget_one2many_product_picker%0Aversion:%2013.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**">feedback</a>.</p>
<p>Do not contact contributors directly about support or help with technical issues.</p>
</div>
<div class="section" id="credits">
<h1><a class="toc-backref" href="#toc-entry-12">Credits</a></h1>
<div class="section" id="authors">
<h2><a class="toc-backref" href="#toc-entry-13">Authors</a></h2>
<ul class="simple">
<li>Tecnativa</li>
</ul>
</div>
<div class="section" id="contributors">
<h2><a class="toc-backref" href="#toc-entry-14">Contributors</a></h2>
<ul>
<li><p class="first"><a class="reference external" href="https://www.tecnativa.com">Tecnativa</a>:</p>
<blockquote>
<ul class="simple">
<li>Alexandre D. Díaz</li>
<li>Pedro M. Baeza</li>
<li>David Vidal</li>
</ul>
</blockquote>
</li>
<li><p class="first">Giovanni Serra &lt;<a class="reference external" href="mailto:giovanni&#64;gslab.it">giovanni&#64;gslab.it</a>&gt;</p>
</li>
</ul>
</div>
<div class="section" id="maintainers">
<h2><a class="toc-backref" href="#toc-entry-15">Maintainers</a></h2>
<p>This module is maintained by the OCA.</p>
<a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
<p>OCA, or the Odoo Community Association, is a nonprofit organization whose
mission is to support the collaborative development of Odoo features and
promote its widespread use.</p>
<p>This module is part of the <a class="reference external" href="https://github.com/OCA/web/tree/13.0/web_widget_one2many_product_picker">OCA/web</a> project on GitHub.</p>
<p>You are welcome to contribute. To learn how please visit <a class="reference external" href="https://odoo-community.org/page/Contribute">https://odoo-community.org/page/Contribute</a>.</p>
</div>
</div>
</div>
</body>
</html>
